const { toCssVal, typeOf } = require("utils/index");
// const baseSrc = "assets/img/local/base.png"; //使用这个路径（已配置过路径别名）图片不会显示，暂时不清楚原因
const baseSrc = "../../assets/img/local/base.png";

Component({
  options: {
    styleIsolation: "apply-shared",
  },
  properties: {
    mode: {
      type: String,
      value: "aspectFill",
      validator(val) {
        return [
          "scaleToFill",
          "aspectFit",
          "aspectFill",
          "widthFix",
          "heightFix",
          "center",
        ].includes(val);
      },
    },
    lazLoad: {
      type: Boolean,
      value: true,
    },
    src: {
      type: String,
      value: "",
    },
    size: {
      type: String,
      value: "",
    },
    height: {
      type: String,
      value: "120",
    },
    width: {
      type: String,
      value: "120",
    },
    radius: {
      type: String,
      value: "0",
    },
    background: {
      type: [String, Boolean],
      value: false,
    },
  },

  data: {
    baseSrc,
    style: "",
  },
  attached() {
    let { size, height, width, radius, background } = this.data;
    radius = toCssVal(radius);
    if (size) {
      size = toCssVal(size);
      height = size;
      width = size;
    } else {
      width = toCssVal(width);
      height = toCssVal(height);
    }
    if (typeOf(background) === "Boolean" && background) {
      background = "red";
    }
    this.setData({
      style: `height:${height}; width:${width};border-radius: ${radius};background: ${background};overflow:hidden;`,
    });
  },
  methods: {},
});
